import React,{Component} from  'react'
import {Button,Form,Select,Input} from 'antd'
import { Link } from 'react-router-dom'
import './product.less'

const FormItem = Form.Item;
const Option = Select.Option;

class Product extends Component{
    constructor(props){
        super(props);
    }
    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFieldsAndScroll((err, values) => {
            if (!err) {
                console.log('Received values of form: ', values);
            }
        });
    }
    render(){
        const { getFieldDecorator } = this.props.form;
        return (

            <div className='product'>
                <h1 className='page-header'>商品管理</h1>
                <div className="addBtn">
                    <Link to="/product-category/add/">
                        <Button type="primary" icon="plus">添加品类</Button>
                    </Link>
                </div>

                <Form  layout="inline" onSubmit={this.handleSubmit}>
                    <FormItem
                    >
                        {getFieldDecorator('parentId', {
                            initialValue: "productId",
                            rules: [{ required: true, message: '请选择父品类' }],
                        })(
                            <Select
                                placeholder="请选择父品类"
                            >
                                <Option key="productId" value="productId">按商品id查询</Option>
                                <Option ley="productName" value="productName">按商品名称查询</Option>
                            </Select>
                        )}
                    </FormItem>
                    <FormItem
                    >
                        {getFieldDecorator('categoryName', {
                        })(
                            <Input   placeholder="请输入品类名称" />
                        )}
                    </FormItem>
                    <FormItem >
                        <Button type="primary" htmlType="submit">保存</Button>
                    </FormItem>
                </Form>


            </div>

        )
    }
}
const WrappedAddForm = Form.create()(Product);

export default WrappedAddForm